@extends('layouts.app')
@section('content')
    <link rel="stylesheet" href="{{ asset('vendor/editor.md/css/editormd.css') }}" />
    <div class="sep20"></div>
    <div style="text-align: left">
        <div style="width: 98%; margin: 0 auto">
            <input class="form-c" name="title" autofocus="autofocus" placeholder="请输入主题标题" />
            <hr>
            @if(!empty($file_list['images']))
            <div class="box">
                <div class="cell">已上传的图片</div>
                <div class="inner">
                    <ul style="margin-top: 0px;">
                        @foreach($file_list['images'] as $item)
                            <li><a href="{{ $item->dir }}" target="_blank">{{ $item->dir }}</a> &nbsp; <span style="cursor: pointer;" class="_copy" data-uri="{{ $item->dir }}">复制地址</span></li>
                        @endforeach
                    </ul>
                </div>
            </div>
            <hr>
            @endif
        </div>
        <div id="editormd">
            <textarea style="display:none;" ></textarea>
        </div>
        <div style="width: 98%; margin: 0 auto; color: #767676">
            {{--分类节点：--}}
            <hr>
            <select class="topic-c" id="cid" onchange="getCategory(this.value)">
                <option value="0">选择一级分类..</option>
                @foreach($categories as $item)
                    <option value="{{ $item['id'] }}">{{ $item['title'] }}</option>
                @endforeach
            </select>
            -
            <select class="topic-c" id="cid-two">
                <option value="0">选择二级分类..</option>
            </select>
            <label><input type="checkbox" name="is_login" value="yes"> 登录可见</label> &nbsp;
            <label><input type="checkbox" name="is_reply" value="yes"> 回复可见</label>
            <button type="button" style="float: right" class="super normal button" onclick="publishTopic();"><li class="fa fa-paper-plane"></li> &nbsp;发布主题</button>
            <hr>
            <hr>
            <div class="outdated">
                <h5>尊重原创</h5>
                <p>请不要发布任何盗版下载链接，包括软件、音乐、电影等等，我们尊重原创。</p>
                <h5>友好互助</h5>
                <p>保持对陌生人的友善。用知识去帮助别人</p>
            </div>
        </div>

    </div>

    <script src="{{ asset('vendor/editor.md/editormd.js') }}"></script>
    <script src="{{ asset('static/js/clipboard.min.js') }}"></script>

    @section('js')
        <script type="text/javascript">
            $(function() {
                var Editor = editormd("editormd", {
                    width: "98%",
                    height: 562,
                    path : "{{ asset('vendor/editor.md/lib') }}/",
                    watch : false,
                    linenumbers: false,
                    placeholder: "请输入主题内容..",
                    toolbarIcons : function() {
                        return ["undo", "redo", "|", "bold", "del", "italic", "quote", "uppercase", "lowercase", "|", "h1", "h2", "h3", "h4", "h5", "h6", "|", "list-ul", "list-ol", "hr", "|", "link", "reference-link", "code", "table", "image", "||", "watch", "preview", "fullscreen", "||", "help"]
                    },
                    imageUpload : true,
                    imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
                    imageUploadURL : "{{ url('/upload') }}?_token="+document.head.getElementsByTagName('meta')['csrf-token'].content
                });
            });
            function getCategory(cid) {
                var index = layer.load(1);
                $.get("{{ url('/get-category') }}", {cid: cid}, function (data) {
                    layer.close(index);
                    if (data.success == true){
                        var html = '';
                        for (var i in data.data){
                            html += '<option value="'+data.data[i].id+'">'+data.data[i].title+'</option>';
                        }
                        $('#cid-two').html(html);
                    }else {
                        alert(data.msg)
                    }
                })
            }
            $('._copy').click(function () {
                var uri = $(this).attr('data-uri');
                var clipboard = new Clipboard('._copy', {
                    text: function() {
                        return uri;
                    }
                });
                clipboard.on('success', function(e) {
                    layer.msg('复制成功: '+uri, {icon: 6, time: 800});
                });
                clipboard.on('error', function(e) {
                    layer.msg('您的浏览器不支持复制，请手动复制！', {icon: 4, time: 800});
                });
            });

        </script>
    @endsection
@endsection
